import React, { useEffect, useState, useRef } from 'react';
import TableDataBlock from '@/components/TableDataBlock';
import PopImgShow from '@/components/PopImgShow';
import { connect } from 'umi';
import { Badge, Button } from 'antd'
import Components from './components';
const ThirdTrace = (props) => {
    const { dispatch, loading, data } = props;
    const { todayTraceAmount, lastActivityType } = data
    const render = () => {
        if (lastActivityType === 'last30') {
            return 'green'
        } else if (lastActivityType === 'last7') {
            return 'yellow'
        } else if (lastActivityType === 'last2') {
            return 'red'
        } else {
            return 'blue'
        }
    }
    const [visible, setVisible] = useState(false)
    if (todayTraceAmount) {
        return (
            <>
                <Badge color={render()} count={todayTraceAmount}>
                    <Button onClick={() => setVisible({
                        show: true,
                        detail: data
                    })} type='link'>
                        用户轨迹
                    </Button>
                </Badge>
                <Components visible={visible} onClose={() => { setVisible(false) }}></Components>
            </>

        );
    }
    return null

};
export default connect(({ loading }) => ({
    loading
}))(ThirdTrace);;
